<template>
  <div class="container">
    <van-nav-bar @click-left="back">
      <van-icon size="20" name="arrow-left" slot="left" color="rgb(150, 151, 153)"/>
      <p slot="title" style="font-size: 14px">修改密码</p>
    </van-nav-bar>
    <van-cell-group>
      <van-field v-model="value" label="新密码" placeholder="请输入新密码"/>
      <van-field v-model="equal" label="确认密码" placeholder="请确认密码"/>
    </van-cell-group>
    <van-button @click="confirm" type="danger" block round style="margin: 10px auto;width: 95%;">确认</van-button>
  </div>
</template>

<script>
import { requestModifyUserPassword } from '../../api/user'

export default {
  name: 'ModifyPassword',
  data () {
    return {
      value: '',
      equal: '',
    }
  },
  methods: {
    back () {
      this.$router.back()
    },
    confirm () {
      if (!this.value.length) {
        this.$notify('输入不得为空')
        return
      }
      if (this.value === this.equal) {
        requestModifyUserPassword(this.value).then(res => {
          console.log(res)
          this.$toast.success({
            message: '修改密码成功'
          })
          this.$router.back()
        })
      } else {
        this.$notify('两次密码输入不一致')
      }
    }
  }
}
</script>

<style scoped>
.container {
  text-align: left;
}
</style>
